<!-- 服务设置 -->
<template>
  <el-card class="box-card" :body-style="{ padding: 10 }">
    <el-form ref="form" :model="form" label-width="120px">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="服务器地址">
            <span>{{ form.socketIp }}</span>
          </el-form-item>
          <el-form-item label="盘点车端口">
            <el-input v-model="form.cartSocketPost"></el-input>
          </el-form-item>
          <el-form-item label="通道门端口">
            <el-input v-model="form.doorSocketPost"></el-input>
          </el-form-item>
          <el-form-item label="密集架端口">
            <el-input v-model="form.mjjSocketPost"></el-input>
          </el-form-item>
          <el-form-item label="系统部署日期">
            {{ form.deployDate }}
          </el-form-item>
          <el-form-item label="系统剩余时间">
            <!-- <em class="primary_button" style="font-weight: 700">{{ form.validDays }}</em> 天 -->
            <el-button type="primary" @click="upgradeSystem" size="mini">升级</el-button>
          </el-form-item>
          <el-form-item label="重置密码">
            <el-input v-model="form.resetPassword"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="HS密集架版本">
            <el-input v-model="form.hsVersion"></el-input>
          </el-form-item>
          <el-form-item label="HS分页">
            <el-input v-model="form.hsPageSize" placeholder="一页多少条"></el-input>
          </el-form-item>
          <el-form-item label="HS类型">
            <el-radio-group v-model="form.hsLabelType">
              <el-radio :label="0">档案</el-radio>
              <el-radio :label="1">档案盒</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="WebSocket路径">
            <el-input v-model="form.websocketPath"></el-input>
          </el-form-item>
          <el-form-item label="WebSocket品牌">
            <el-input v-model="form.websocketBrand"></el-input>
          </el-form-item>
          <el-form-item label="Token过期时间">
            <el-input v-model="form.tokenExpireTime">
              <template slot="append">毫秒 = {{ formatTime(form.tokenExpireTime) }}</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <span class="beCareful_text" style="margin-left: 10px">
          *注意：非系统管理人员禁止随意更改，否则后果自负</span>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script>
import { getServiceSettings, editServiceSettings } from '@/api/request.js'
import { getRegister, checkingCode } from '@/api/init'
export default {
  name: 'serviceSetting',
  components: {},
  data() {
    return {
      form: {},
    }
  },
  computed: {},
  watch: {},
  created() { },
  mounted() {
    this.getList()
  },
  methods: {
    formatTime(ms) {
      if (isNaN(ms) || ms < 0) {
        return 'Invalid time'
      }

      const totalSeconds = Math.floor(ms / 1000)
      const hours = Math.floor(totalSeconds / 3600)
      const minutes = Math.floor((totalSeconds % 3600) / 60)
      const seconds = totalSeconds % 60

      // 格式化输出，确保小时、分钟和秒都有两位数
      const pad = (num) => (num < 10 ? '0' + num : num)
      return `${pad(hours)}小时${pad(minutes)}分钟${pad(seconds)}秒`
    },
    async upgradeSystem() {
      const res = await getRegister()
      this.$prompt(`${res.data.data.serialNumber}    请联系商家获取激活码`, '提示', {
        confirmButtonText: '确定',
        closeOnClickModal: false,
      }).then(async ({ value }) => {
        const result = await checkingCode({ ...res.data.data, registryCode: value })
        if (result.data.code === 200) {
          this.$message.success('升级成功')
        } else {
          this.$message.error(result.data.message)
        }
      })
    },
    async getList() {
      const res = await getServiceSettings()
      if (res.data.code == 200) {
        this.form = res.data.data
      } else {
        this.$message.error(res.data.message)
      }
    },
    onSubmit() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          editServiceSettings(this.form)
            .then((res) => {
              if (res.data.code === 200) {
                this.$message.success(res.data.message)
              } else {
                this.$message.error(res.data.message)
              }
            })
            .catch((err) => {
              this.$message.error(err)
            })
        } else {
          return false
        }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>
